import React, {Component} from "react"; //引入react
import {Route, Switch , HashRouter, Redirect} from "react-router-dom"; //引入路由控制

import AsyncComponent from "../components/AsyncComponent";//按需加载
import Routers from "./routerConifg";
import Footer from "../components/Footer";
// import {connect} from "react-redux";
const noMatch = AsyncComponent(() => import("../pages/foot/noMatch")); //异步引入文件

//按需加载组件实现原理  参数为一个import加载的 promise 对象

class index extends Component {
    constructor(props){
        super(props);
        console.log(this.props.userData)
    }
  
    componentWillMount() {
        //在这里初始化token
        this.setState({isLoading:true})
        setTimeout(()=>{
            this.setState({isLoading:false})
        },20)
    }


    render() {

        let {isLoading} = this.state;
        if(isLoading){
            return <p>页面加载中！~~~</p>;
        }else{
            return (
                <HashRouter>
                    <div className={"min-height"}>
                        {/*<Header></Header>*/}
                        <Switch >
                                {Routers.map((item, index) => {
                                        return <Route   key={index} path={item.path} exact
                                                       render={(props) => {

                                                           let token = this.props.store.getState()['userData']['name'];
                                                           if(!item.auth||token){
                                                               return <item.component {...props} />
                                                           }else{
                                                               return <Redirect to={{
                                                                   pathname: '/contact',
                                                                   state: {from: props.location,name:item.title}
                                                               }}/>;
                                                           }
                                                           document.title=item.title;
                                                       }
                                                       } />

                                })}
                                <Route component={noMatch}/>
                        </Switch>
                        <Footer></Footer>
                    </div>

                </HashRouter>
            );
        }

    }
}



export default  index;
